<template>
  <div>
    <div v-for="item in children" :key="item.id" class="wrapper">
      <div class="left">{{ item.authName }}</div>
      <div class="right">
        <Tags
          v-if="level !== 10"
          :children="item.children"
          :level="level + 1"
        />
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: "Tags",
  props: {
    children: Array,
    level: {
      type: Number,
      default: 0,
    },
  },
  data() {
    return {};
  },
  mounted() {},
  methods: {},
};
</script>
<style lang="scss" scoped>
.wrapper {
  display: flex;
  border:  1px solid  #CCC;
  .left {
    padding: 20px;
    display: flex;
  }
  .right {
    flex: 1;
  }
}
</style>
